<!DOCTYPE HTML>
<html lang="zh" xmlns:th="http://www.thymeleaf.org">
<meta charset="utf-8">
<head th:include="include :: header"></head>
<link th:href="@{/css/jquery.editable-select.css}" rel="stylesheet"/>
<body class="white-bg">
	<div class="wrapper wrapper-content animated fadeInRight ibox-content">
		<form class="form-horizontal m" id="form-wisDataGroup-edit" th:object="${wisDataGroup}" autocomplete="off">
			<input id="id" name="id" th:field="*{id}" type="hidden">
			<div class="form-group">
				<label class="col-sm-2 control-label"><span class="red">*</span>同步组组名：</label>
				<div class="col-sm-4">
					<input id="groupName" name="groupName" th:field="*{groupName}" class="form-control " readonly type="text" >
				</div>
			</div>
			<div class="form-group">
				<label class="col-sm-2 control-label"><span class="red">*</span>同步数据源：</label>
				<div class="col-sm-4">
					<input id="sourceaName" name="sourceaName" class="form-control" readonly type="text" th:field="*{sourceaName}">
				</div>
				<label class="col-sm-2 control-label"><span class="red">*</span>目标数据源：</label>
				<div class="col-sm-4">
					<input id="sourcebName" name="sourcebName" type="text" class="form-control" readonly th:field="*{sourcebName}">
				</div>
			</div>
			<div class="form-group">
				<label class="col-sm-2 control-label"><span class="red">*</span>同步表名称：</label>
				<div class="col-sm-4">
					<input id="tabName" name="tabName" class="form-control" readonly th:field="*{tabName}" type="text">
				</div>
				<label class="col-sm-2 control-label"><span class="red">*</span>目标表名称：</label>
				<div class="col-sm-4">
					<input id="targetName" name="targetName" class="form-control" readonly th:field="*{targetName}" type="text">
				</div>
			</div>
			
			<div class="form-group">
				<label class="col-sm-2 control-label">同步组状态：</label>
				<div class="col-sm-4">
					<label class="radio-box"><input type="radio" value="1" th:field="*{state}" id="state1" name="state">启用</label>
	                <label class="radio-box"><input type="radio" th:field="*{state}" value="0" id="state2" name="state">停用</label>
				</div>
				<label class="col-sm-2 control-label"><span class="red">*</span>同步策略：</label>
				<div class="col-sm-4">
	                <select id="syncWay" name="syncWay" class="form-control" th:field="*{syncWay}" required>
						<option value="">--请选择--</option>
						<option value="0">同步表数据写入目标表</option>
						<option value="1">目标表数据写入同步表</option>
						<option value="2">双向写入</option>
					</select>
				</div>
			</div>
			
			
			<div class="form-group">
	            <div class="col-sm-12">
	                <div class="ibox float-e-margins">
	                    <div class="ibox-title">
	                        <h5 class="ibox-title-h5 activite"><a href="javascript:;">编辑字段</a></h5>
	                        <h5 class="ibox-title-h5 " style="margin-left: 5px;"><a href="javascript:editCol_view();">查看字段</a></h5>
	                        <div class="ibox-tools">
	                            <a class="collapse-link">
	                                <i class="fa fa-chevron-up"></i>
	                            </a>
	                            <a class="dropdown-toggle  add-column-item"  href="javascript:;">
	                                <i class="fa fa-plus"></i>
	                            </a>
	                        </div>
	                    </div>
	                    <div class="ibox-content" style="padding:  0px 0px 0px">
	                        <table class="table table-bordered data-tr">
	                            <thead>
	                                <tr>
	                                    <th style="width: 30%;">字段名称</th>
	                                    <th style="width: 10%;">默认值</th>
	                                    <th style="width: 30%;">目标字段名称</th>
	                                    <th style="width: 10%;">目标默认值</th>
	                                    <th  style="width: 5%;" title="字段是否是关联字段">关联字段</th>
	                                    <th>操作</th>
	                                </tr>
	                            </thead>
	                            <tbody>
	                            	<tr th:each="colItem,colStat:${wisDataColList}" >
	                            		<td>
	                            			<select th:name="${'cloumn['+colStat.index+'].colName'}" class="form-control colName" required >
		                                    	<option value="">--请选择--</option>
	               								<option th:each="cola : ${colList}" th:text="${cola.name+'--'+cola.type+'--'+cola.comments}" th:selected="${colItem.colName == cola.name}"  th:value="${cola.name}" th:col_type="${cola.type}" th:comments="${cola.comments}"></option>
		                                    </select>
		                                    <input th:name="${'cloumn['+colStat.index+'].id'}" type="hidden" th:value="${colItem.id}">
		                                    <input th:name="${'cloumn['+colStat.index+'].colDesc'}" type="hidden" class="colDesc" th:value="${colItem.colDesc}">
		                                    <input th:name="${'cloumn['+colStat.index+'].colType'}" type="hidden" class="colType" th:value="${colItem.colType}">
	                            		</td>
	                            		<td>
	                            			<select th:name="${'cloumn['+colStat.index+'].dvalue'}" class="form-control editable_select" th:value="${colItem.dvalue}" >
	                            				<option value="">--请选择--</option>
	               								<option value="DATE" >当前时间</option>
	               								<option value="USERID" >当前用户ID</option>
	               								<option value="USERNAME" >当前用户名</option>
	                            			</select>
	                            		</td>
	                                    <td style="position: relative;">
		                                    <select th:name="${'cloumn['+colStat.index+'].targetCol'}" class="form-control targetCol" required>
		                                    	<option value="">--请选择--</option>
												<option th:each="cola : ${targetColList}" th:text="${cola.name+'--'+cola.type+'--'+cola.comments}" th:selected="${colItem.targetCol==cola.name}" th:value="${cola.name}" th:col_type="${cola.type}" th:comments="${cola.comments}"></option>												
		                                    </select>
		                                    <input th:name="${'cloumn['+colStat.index+'].targetDesc'}" type="hidden" class="targetDesc" th:value="${colItem.targetDesc}">
		                                    <input th:name="${'cloumn['+colStat.index+'].targetType'}" type="hidden" class="targetType" th:value="${colItem.targetType}">
	                                    </td>
	                            		
	                            		<td>
	                            			<select th:name="${'cloumn['+colStat.index+'].tdvalue'}" class="form-control editable_select" th:value="${colItem.tdvalue}" >
	                            				<option value="">--请选择--</option>
	               								<option value="DATE" >当前时间</option>
	               								<option value="USERID" >当前用户ID</option>
	               								<option value="USERNAME" >当前用户名</option>
	                            			</select>
	                            		</td>
	                            		
	                                    <td><label class="check-box table-check-box-center"><input th:name="${'cloumn['+colStat.index+'].linkedCol'}" type="checkbox" value="1" th:checked="${colItem.linkedCol==1}"></label></td>
	                                    <td>
	                                    	<a th:if="${colStat.index == 0}" href="javascript:;" class="add-column-item">新增</a>
	                                    	<a th:if="${colStat.index > 0 }" href="javascript:;" th:onclick="${'delColumn('+colItem.id+')'}">删除</a>
	                                    </td>
	                            	</tr>
	                                <tr th:if="${#lists.size(wisDataColList) == 0}">
	                                    <td>
	                            			<select name="cloumn[0].colName" class="form-control  colName" required >
		                                    	<option value="">--请选择--</option>
	               								<option th:each="cola : ${colList}" th:text="${cola.name+'--'+cola.type+'--'+cola.comments}"  th:value="${cola.name}" th:col_type="${cola.type}" th:comments="${cola.comments}"></option>
		                                    </select>
		                                    <input name="cloumn[0].colDesc" class="colDesc " type="hidden" >
		                                    <input name="cloumn[0].colType" class="colType " type="hidden" >
	                            		</td>
	                            		
	                            		<td>
	                            			<select th:name="cloumn[0].dvalue" class="form-control editable_select" >
	                            				<option value="">--请选择--</option>
	               								<option value="DATE" >当前时间</option>
	               								<option value="USERID" >当前用户ID</option>
	               								<option value="USERNAME" >当前用户名</option>
	                            			</select>
	                            		</td>
	                                    <td style="position: relative;">
		                                    <select name="cloumn[0].targetCol" class="form-control targetCol" required >
		                                    	<option value="">--请选择--</option>
	               								<option th:each="cola : ${targetColList}" th:text="${cola.name+'--'+cola.type+'--'+cola.comments}"  th:value="${cola.name}" th:col_type="${cola.type}" th:comments="${cola.comments}"></option>
		                                    </select>
		                                    <input name="cloumn[0].targetDesc" class="targetDesc " type="hidden" >
		                                    <input name="cloumn[0].targetType" class="targetType " type="hidden" >
	                                    </td>
	                                    
	                            		<td>
	                            			<select th:name="cloumn[0].tdvalue" class="form-control editable_select" >
	                            				<option value="">--请选择--</option>
	               								<option value="DATE" >当前时间</option>
	               								<option value="USERID" >当前用户ID</option>
	               								<option value="USERNAME" >当前用户名</option>
	                            			</select>
	                            		</td>
	                                    <td><label class="check-box table-check-box-center"><input name="cloumn[0].linkedCol" type="checkbox" value="1" ></label></td>
	                                    <td>
	                                    	<a  href="javascript:;" class="add-column-item">新增</a>
	                                    </td>
	                                </tr>
	                               
	                            </tbody>
	                        </table>
	
	                    </div>
	                </div>
	            </div>
            </div>
            
            
            <div class="form-group">
	            <div class="form-control-static col-sm-offset-10 buttonleft">
	                <button type="button" class="btn btn-primary" onclick="submitHandler();">提交</button>
	                <button onclick="close_this_tab()" class="btn btn-danger" type="button">关闭</button>
	            </div>
        	</div>
        
		</form>
	</div>
	<div th:include="include::footer"></div>
	<script type="text/javascript" src="/ajax/libs/jquery.editable-select.js"></script>
    <script type="text/javascript" src="/svs/scripts/views-editable-select.js"></script>
    <script type="text/javascript" src="/svs/scripts/views-sync-column.js"></script>
	<script type="text/javascript">
		var prefix = ctx + "quartz/wisDataGroup"

		EditableSelectView.init() ;
		function submitHandler() {
			if ($.validate.form()) {
	        	$.modal.loading("正在处理中，请稍后...");
	        	var config = {
        	        url: prefix + "/editWidthCol",
        	        type: "post",
        	        dataType: "json",
        	        data: $('#form-wisDataGroup-edit').serialize(),
        	        success: function(result) {
        	        	$.modal.msgSuccess('保存成功...........');
        	        	$.modal.closeLoading() ;
        	        	$.modal.refreshTab() ;
        	        }
        	    };
        	    $.ajax(config)
	        }
		}
		
		
		function close_this_tab() {
			parent.$('.page-tabs-content').find('.active i').trigger("click");
		}
		
		function editCol_view() {
			var id = '[[${wisDataGroup.id}]]' ;
			var url = prefix + "/editCol_View/"+id ;
			var currentId = parent.$('.page-tabs-content').find('.active').attr('data-id');
        	var target = parent.$('.Svs_iframe[data-id="' + currentId + '"]');
        	target.attr('data-id',url) ;
        	parent.$('.page-tabs-content').find('.active').attr('data-id',url) ;
            target.attr('src', url).ready();
            
			$.modal.refreshTab() ;
		}
		
		
		
		function delColumn(id) {
        	$.modal.confirm("确定删除对接字段关系吗？", function() {
        		$.modal.loading("正在处理中，请稍后...");
        		var url = prefix + '/delColumn?id='+id ;
            	var config = {
        	        url: url,
        	        type: 'post',
        	        dataType: 'json',
        	        data: {},
        	        success: function(result) {
        	        	$.modal.msgSuccess('同步成功...........');
        	        	$.modal.closeLoading() ;
        	        	$.modal.refreshTab() ;
        	        }
        	    };
        	    $.ajax(config)
        	})
        }
	</script>
</body>
</html>
